<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			/*js的事件：1.鼠标，2.键盘 3.状态*/
			//状态
			//onload：页面装载完成之后被调用
			function initdata(){
				alert(123);
			}
			//onchange：值改变的时候被触发
			function changeV(v){
				alert(v);
			}
			//onblur:失去焦点
			function onb(v){
				console.log(v);
			}
			//onfocus：获取焦点
			function onf(v){
				console.log(v+"f");
			}
			//基于onchange事件的联动
			function changeProvince(v){
				//alert(v);
				var city = "";
				if(v == 1){
					city = '<option value="1">海淀</option><option value="2">朝阳</option><option value="3">昌平</option>';
				}else if(v == 2){
					city = '<option value="1">郑州</option><option value="2">新乡</option><option value="3">洛阳</option>';
				}else{
					city = '<option value="1">石家庄</option><option value="2">保定</option><option value="3">邯郸</option>';
				}

				//获取市的下拉列表对象
				document.getElementById("city").innerHTML=city;
			}
			
			/*function onc(){
				console.log("按钮调用");
			}*/
			
			function getkv(v){
				console.log(v);
			}
		</script>
	</head>
	<body>
		<p>123</p>
		<button id="btn">按钮</button><br>
		<input type="text" name="username" onkeyup="getkv(this.value)"><br>
		<input type="text" name="username" id="username" value="admin" onchange="changeV(this.value)" onblur="onb(this.value)" onfocus="onf(this.value)"/><br>
		省：<select onchange="changeProvince(this.value)">
			<option value="1">北京</option>
			<option value="2">河南</option>
			<option value="3">河北</option>
		</select>
		市：<select id="city">
			</select>
	</body>
	<script>
		//获取按钮对象
		//页面加载顺序
		var btn = document.getElementById("btn");//null
		//alert(btn);	
		/*btn.onclick = function(){
			alert("按钮")
		}*/
		btn.onclick = getmsg;//根据函数名去调用
		//使用函数名称时加上(),方法直接会被执行，getmsg
		function getmsg(){
			console.log("按钮");
		}
	</script>
</html>
